<!DOCTYPE html>
<html>
<head>
    <title>医学文本分析</title>
    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
    <style>
        body { font-family: Arial; max-width: 800px; margin: 0 auto; padding: 20px; }
        textarea { width: 100%; height: 100px; margin-bottom: 10px; }
        button { padding: 10px 15px; background: #4CAF50; color: white; border: none; cursor: pointer; }
        #result { margin-top: 20px; padding: 15px; background: #f5f5f5; border-radius: 5px; }
    </style>
</head>
<body>
    <h1>医学文本分析系统</h1>
    
    <div>
        <h3>影像所见:</h3>
        <textarea id="imagingText"></textarea>
    </div>
    
    <div>
        <h3>诊断结果:</h3>
        <textarea id="diagnosisText"></textarea>
    </div>
    
    <button onclick="analyzeText()">分析文本</button>
    
    <div id="result"></div>
<script>
        function analyzeText() {
            const imaging = document.getElementById('imagingText').value;
            const diagnosis = document.getElementById('diagnosisText').value;
            
            axios.post('/sentence_process', {
                imaging: imaging,
                diagnosis: diagnosis
            }).then(response => {
                let html = '<h3>分析结果:</h3>';
                
                // 显示实体识别结果
                html += `<h4>影像实体:</h4><ul>`;
                response.data.imaging_entities.forEach(e => {
                    html += `<li>${e}</li>`;
                });
                html += `</ul>`;
                
                html += `<h4>诊断实体:</h4><ul>`;
                response.data.diagnosis_entities.forEach(e => {
                    html += `<li>${e}</li>`;
                });
                html += `</ul>`;
                
                // 显示冲突结果
                if(response.data.conflicts && response.data.conflicts.length > 0) {
                    html += `<h4>方位冲突检测:</h4><ul>`;
                    response.data.conflicts.forEach(e => {
                        html += `<li>${e}</li>`;
                    });
                    html += `</ul>`;
                }
                
                // 显示报告结果
                if(response.data.report && response.data.report.length > 0) {
                    html += `<h4>医学报告冲突:</h4><table border="1" cellpadding="5">`;
                    html += `<tr><th>序号</th><th>解剖部位</th><th>影像异常</th><th>诊断异常</th><th>状态</th><th>详情</th></tr>`;
                    
                    response.data.report.forEach((item, idx) => {
                        html += `<tr>
                            <td>${idx+1}</td>
                            <td>${item['解剖部位']}</td>
                            <td>${item['影像异常']}</td>
                            <td>${item['诊断异常']}</td>
                            <td>${item['状态']}</td>
                            <td>${item['详情']}</td>
                        </tr>`;
                    });
                    
                    html += `</table>`;
                }
                
                document.getElementById('result').innerHTML = html;
                
            }).catch(error => {
                document.getElementById('result').innerHTML = 
                    `<div style="color:red">错误: ${error.response?.data?.message || error.message}</div>`;
            });
        }
</script>
</body>
</html>